<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <!--头部固定引用-->
    <meta charset="utf-8">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="../../css/base.css">
    <link rel="stylesheet" href="../../css/icon-font.css"/><!--图标-->
    <!--固定引用结束,自定义引用添加在下面-->
    <title>JT2</title>
    <!--页面样式添加在这里，多看看base。css里面的公共样式，大部分常用的都有，避免使用独立css文件为单独页面设置样式，避免随意添加样式到公共样式-->
    <style>
        .user-messageInfo-redPoint {
            width: 0.16rem;
            height: 0.16rem;
            background: rgba(236, 62, 51, 1);
            border-radius: 0.14rem;
            margin-top: 0.12rem;

        }

        .user-messageInfo-titleMsg {
            width: 6.86rem;
            height: 0.88rem;
            color: rgba(34, 34, 34, 1);
            line-height: 0.44rem;

        }

        .user-messageInfo-article {
            color: rgba(34, 34, 34, 0.7);
            line-height: 0.42rem;
            margin-top: 0.04rem;
        }

        .user-messageInfo-updateTime {
            color: rgba(34, 34, 34, 0.45);
            line-height: 0.34rem;
        }

        .user-messageInfo-eachInfoTotal {
            margin: 0.28rem 0.32rem 0.28rem 0.32rem;
        }

        .userflex-row-infoTotal {
            margin-top: 0.16rem;
        }

        .user-messageInfo-fastValue {
            padding-top: 0.02rem;
            padding-right: 0.08rem;
            padding-left: 0.08rem;
            border-radius: 0.04rem;
            border: 1px solid rgba(151, 151, 151, 1);
            color: rgba(34, 34, 34, 0.45);
            line-height: 0.28rem;
        }

        .user-messageInfo-line3 {
            margin-top: 0.14rem;
        }

        .message-info-noMsg img {
            margin-top: 2.62rem;
            width: 5.18rem;
            height: 2.16rem;
        }

        .message-info-noMsgText {
            margin-top: 0.14rem;
            color: rgba(34, 34, 34, 0.7);
            line-height: 0.34rem;
        }
    </style>
</head>
<!--尽量不要在body上添加样式，除了背景色-->
<body>
<div class="flex-column ff400 h-100-p">
    <!--头部部分-->

    <div class="placeholder-top">
        <!--状态栏-->
        <div class="bg-main status-bar"></div>
        <!--导航栏-->
        <div class="bg-main nav-bar flex-row justify-content-between c-white align-items-center">
            <div class="left-bar" onclick="clickBack()">
                <span class="iconfont iconfanhui1 fs16"></span>
            </div>
            <div class="center-bar fs16 ff500 line1">资讯消息</div>
            <div class="right-bar align-items-center edit-right-bar">

            </div>
        </div>
    </div>


    <!--功能模块-->
    <!--    资讯消息列表-->
    <div class="message-info-infoListCache flex-1 scoll-y scoll-area">

    </div>
<!--    <div class="more"></div>-->
    <!--    &lt;!&ndash;单条资讯消息&ndash;&gt;-->
    <!--    <div class="userflex-row-infoTotal bg-white flex-column">-->
    <!--        &lt;!&ndash;单条资讯信息的全部文字部分&ndash;&gt;-->
    <!--        <div class="user-messageInfo-eachInfoTotal" onclick="goDetail">-->
    <!--            <div class="user-messageInfo-title">-->
    <!--                &lt;!&ndash;小红点&ndash;&gt;-->
    <!--                <span class="user-messageInfo-redPoint" style="display: inline-block"></span>-->
    <!--                &lt;!&ndash;资讯消息标题&ndash;&gt;-->
    <!--                <span class="user-messageInfo-titleMsg fs15 ff500" style=" margin-left: 0.16rem;">【公募FOF日益青睐主动型基金产品 股票资产占比持续提升</span>-->
    <!--            </div>-->
    <!--            &lt;!&ndash;资讯消息主体&ndash;&gt;-->
    <!--            <div class="user-messageInfo-article fs14 ff400">美联储周三公布的数据显示，6月美国工业生产环比增长了5.4%，明显好于市场预期的增长4.3%，且创…</div>-->
    <!--            <div class="user-messageInfo-line3 flex-row">-->
    <!--                &lt;!&ndash;所属模块显示&ndash;&gt;-->
    <!--                <div class="user-messageInfo-fastValue fs10 ff500">快评</div>-->
    <!--                &lt;!&ndash;更新时间&ndash;&gt;-->
    <!--                <div class="user-messageInfo-updateTime ff500 fs12" style="margin-left: 0.12rem">50分钟前</div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->


    <!--    &lt;!&ndash;单条资讯消息&ndash;&gt;-->
    <!--    <div class="userflex-row-infoTotal bg-white flex-column">-->
    <!--        &lt;!&ndash;单条资讯信息的全部文字部分&ndash;&gt;-->
    <!--        <div class="user-messageInfo-eachInfoTotal">-->
    <!--            <div class="user-messageInfo-title">-->
    <!--                &lt;!&ndash;资讯消息标题&ndash;&gt;-->
    <!--                <span class="user-messageInfo-titleMsg fs15 ff500 ">公募FOF日益青睐主动型基金产品 股票资产占比持续提升</span>-->
    <!--            </div>-->
    <!--            &lt;!&ndash;资讯消息主体&ndash;&gt;-->
    <!--            <div class="user-messageInfo-article fs14 ff400">美联储周三公布的数据显示，6月美国工业生产环比增长了5.4%，明显好于市场预期的增长4.3%，且创…</div>-->
    <!--            <div class="user-messageInfo-line3 flex-row">-->
    <!--                &lt;!&ndash;更新时间&ndash;&gt;-->
    <!--                <div class="user-messageInfo-updateTime ff500 fs12">50分钟前</div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
</div>
<!--具体代码-->
</body>
<!--下面四个文件为固定引用，自己根据情况调整路径，不要跟换引入顺序，其他引用添加在后面-->
<script src="../../js/dict.js"></script>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/checkJsBridge.js"></script>
<script src="../../js/utils.js"></script>
<!--固定引用结束-->
<script src="../../js/date.js"></script>
<script src="../../js/api.js"></script>
<!--避免一个页面包含过多功能，减少js重绘页面，推荐分功能，分页面-->
<script>
    let pm = {
      dateCache : 0,
      isScroll:true,
      nullNum:0
    }
    /*固定页面初始化方法，用于替代$(function(){}),param为url参数，Object类型*/
    function initPage(params) {
      //状态栏自适应
      Utils.sbhAdaptive()
      pageScrollDiv(getInfoListCache)
      getInfoListCache()
    }

    /*页面所在窗口由后台前台时触发的方法,param为url参数，Object类型*/
    function startPage(params) {
      reLoadPage()
      //getInfoListCache()
    }

    function reLoadPage() {
      pm = {
        dateCache : 0,
        isScroll:true,
        nullNum:0
      }
      $('.message-info-infoListCache').html('')
      getInfoListCache()
    }

    //获取缓存中的资讯消息列表
    function getInfoListCache() {
      //获取最近n天的资讯列表
      let count = 5
      let htmlStr = ''
      let flag = true
      let array = []
      let nullMaxDate = 3
      for (let i = count - 1; i >= 0; i--) {
        let tmpDate = DateUtils.getLastDateForm(-i - pm.dateCache * count)
        let dateKey = 'notice_info_list' + tmpDate
        array.push(jsBridge.getData(dateKey))
      }
      Promise.all(array).then(([list1, list2, list3, list4, list5]) => {
        list1 = list1 ? list1 : []
        list2 = list2 ? list2 : []
        list3 = list3 ? list3 : []
        list4 = list4 ? list4 : []
        list5 = list5 ? list5 : []
        let infoListCache = [...list1,...list2,...list3,...list4,...list5]
        if (infoListCache.length === 0){
          pm.nullNum ++
          if (pm.nullNum === nullMaxDate) {
            pm.isScroll = false
          }
        }
        else {
          pm.nullNum = 0
        }
        if (infoListCache && infoListCache.length > 0) {
          pm.isScroll = true
          flag = false
          for (let i = infoListCache.length - 1; i >= 0; i--) {
            let item = infoListCache[i]
            if (item.length !== 0){
              let jsonStr = JSON.stringify({
                infoId: item.infoId,
                infoType: item.infoType,
              })
              htmlStr += '<div class="userflex-row-infoTotal bg-white flex-column flex-1 scoll-y">\n' +
                      '        <!--单条资讯信息的全部文字部分-->\n'
              htmlStr += '<div class="user-messageInfo-eachInfoTotal" onclick=\'infoRead(' + jsonStr + ', ' + item.issuerDttm + ',this)\'>'
              htmlStr +=
                      '                    <div class="user-messageInfo-title line2">\n' +
                      '                        <!--小红点-->\n'
              if (item.isRead === '0') {
                htmlStr += '<span class="user-messageInfo-redPoint" style="display: inline-block"></span>'
                htmlStr += '<span class="user-messageInfo-titleMsg fs15 ff500" style=" margin-left: 0.16rem;">' + item.mainTitle + '</span>\n'

              } else {
                htmlStr += '<span class="user-messageInfo-titleMsg fs15 ff500">' + item.mainTitle + '</span>\n'
              }
              htmlStr += '                        <!--资讯消息标题-->\n' +
                      '                    </div>\n' +
                      '                    <!--资讯消息主体-->\n' +
                      '                    <div class="user-messageInfo-article fs14 ff400 line2">' + item.content + '</div>\n' +
                      '                    <div class="user-messageInfo-line3 flex-row">\n' +
                      '                        <!--所属模块显示-->\n'
              let showInfoType = getInfoType(item.isFastComment)
              if (showInfoType !== -1) {
                htmlStr += '<div class="user-messageInfo-fastValue fs10 ff500">' + showInfoType + '</div>\n'
                htmlStr += '                         <!--更新时间-->\n' +
                          '<div class="user-messageInfo-updateTime ff500 fs12" style="margin-left: 0.12rem">' + DateUtils.int2TimeDesc(item.issuerDttm) + '</div>\n'
              } else {
                htmlStr += '<div class="user-messageInfo-updateTime ff500 fs12">' + DateUtils.int2TimeDesc(item.issuerDttm) + '</div>\n'

              }
              htmlStr += '                    </div>\n' +
                      '                </div>\n' +
                      '    </div>'
            }

          }
        }
        addMsgShow(flag, htmlStr)
      }
      )
    }

    function addMsgShow(flag, htmlStr) {
      if (!flag || $('.message-info-infoListCache').html() !== '') {
        $('.message-info-infoListCache').append(htmlStr)
      } else {
        htmlStr =
              `<div class="message-info-noMsg flex-row justify-content-center"><img src="../../images/user/messageInfo-noMsg.png"></div>
                        <div class="message-info-noMsgText flex-row justify-content-center fs12 ff400">暂无相关内容</div>`
        $('.message-info-infoListCache').html(htmlStr)
      }
    }

    //查询本条资讯是否是快评
    function getInfoType(isFastComment) {
      if (isFastComment) {
        return '快评'
      }
      return -1
    }

    //用户点击某条资讯阅读详情
    function infoRead(jsonStr, issuerDttm) {

      //新增用户的阅读日志
      insertMessageReadLogRedis(jsonStr.infoId)

      //用户点击资讯详情后将该公告标为已阅读
      setInfoRead(jsonStr.infoId, issuerDttm)

      //跳转到资讯详情
      goDetail(jsonStr)
    }

    //用户点击资讯详情时增加阅读日志
    function insertMessageReadLogRedis(messageId) {
      Server.messageInfo.insertMessageReadLogRedis({
        messageId: messageId,
        messageType: '2'
      }).then(
      )
    }

    //用户点击资讯详情后将该资讯标为已阅读
    function setInfoRead(infoId, issuerDttm) {
      jsBridge.setInfoRead({infoId: infoId, issuerDttm: issuerDttm}).then()
    }


    function pageScrollDiv (callback) {
      //需要特殊处理的滚动区域，需要放在scroller元素区域内
      $('.scoll-area').on('scroll', function () {
        if (pm.isScroll) {
          let scrollTop = $(this).scrollTop()//滚动条位置
          let windowHeight = $('.scoll-area').height()//显示区域高度
          let scrollHeight = $(this)[0].scrollHeight//页面内容区域实际高度
          if (pm.isScroll && scrollTop + windowHeight >= scrollHeight - 100) {
            //$('.more').html('加载中…')

            //防止二次加载
            pm.isScroll = false
            pm.dateCache++

            if (callback) {
              callback()
            }
          }
        }
      })
    }
</script>
</html>
